// createApp 创建vue根实例的方法
import { createApp } from 'vue'
// 导入公共样式
import './style.css'
// 导入根组件
import App from './App.vue'
import router from './router/index'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import store from './store/index'
import {createPinia} from 'pinia'
// import * as ElementPlusIconsVue from '@element-plus/icons-vue'
// vue3的  createApp   创建的app 和以前的Vue 操作有什么有点
// Vue.use() 和app.use()的区别
// Vue.use 是将插件 挂载到vue的库，打包需要打包全部的vue 库
// vue3的app是vue的对象 将插件挂载到app对象 ，还可以按需打包，不打包整个
// vue库

let app=createApp(App);


// vue2 自定义全局指令
// Vue.directive('myif', {
//     bind(){},
//     inserted(){},
//    update(){},
//    updateComponent(){},
//    unbind(){}
// });

app.directive('myif', {
    created(){},
    beforeMount(){},
    mounted(el,binding){
        if(binding.value){
          el.style.display="block"
        }else{
             el.style.display="none"
        }
    },
    beforeUpdate(){},
    updated(){},
    beforeUnmount(){},
    unmounted(){}
});
// vue3使用pinia的全局配置
let pinia=createPinia()
app.use(pinia)

// vue3使用vuex
app.use(store)
// vue3 挂载路由
app.use(router)
// 循环将图标库的组件 注册为全局组件
// for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
//   // vue2注册全局组件的方法  Vue.component()
//   app.component(key, component)
// }
// 加载elementplus插件
app.use(ElementPlus)

// Vue.prototype.插件名=插件
// app.config是全局配置 vue3的属性
app.config.globalProperties.run=()=>{
    console.log("公共插件")
}
// 将根组件挂载
app.mount('#app')


